<!-- 自制 首页导航卡片 -->
<template>
	<view class="freeTestCard_con" @click="goMethod">
		<view class="badge" v-if="props.badge">
			<text class="badge_font">
				已开启
			</text>
		</view>
		<view class="freeTestCard">
			<image class="img" :src="props.imgUrl" mode="widthFix"></image>
			<text class="title">
				{{props.title}}
			</text>
		</view>
	</view>
</template>

<script lang="ts" setup>
	const props = defineProps(["imgUrl","badge","title"])
	
	const goMethod = () => {
		console.log('我是??==>>',props.title);
		// uni.navigateTo({
		// 	url:props.navigateUrl,
		// })
	}
</script>

<style>
.freeTestCard_con{
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: space-evenly;
	width: 30vw;
	height: 30vh;
	border-radius: 5%;
	background-color: #f1f1f1;
	margin-top: 3vh;
}
.badge{
	position: absolute;
	width: 7vw;
	text-align: center;
	padding: 0.5vh 0;
	background-color: #00aa7f;
	color: white;
	left: 0;
	top: 0;
	border-radius: 10%;
}
.freeTestCard{
	display: flex;
	flex-direction: column;
	align-items: center;
}
.img{
	width: 10vw;
	margin-bottom: 1vh;
}
</style>